<!-- start: BlackCat PageFooter -->

<script>
/* eslint-disable no-undef */

const renderHeading = () => {
  const $target = $('#mainContent')
  const base = $('#lnkBlogLogo').attr('href')

  const { pathname } = window.location
  const isHomePage = pathname.replace(/\//g, '') === window.currentBlogApp || pathname.includes(`${ window.currentBlogApp }/default.html`)
  const isTagPage = pathname.split('/').includes('tag') && window.tagManager && $.isArray(window.tagManager.tags)

  const $homeLink = $(`<a>随笔</a>`)
  $homeLink.attr('href', base)
  isHomePage && $homeLink.addClass('active').attr('aria-current', 'page')

  const $tagLink = $('<a>标签</a>')
  $tagLink.attr('href', base.endsWith('/') ? `${ base }tag/` : `${ base }/tag/`)
  isTagPage && $tagLink.addClass('active').attr('aria-current', 'page')

  if (isHomePage || isTagPage) {
    const $content = $('<div blackcat />')
    $content.append([$homeLink, $tagLink])
    $target.prepend($content)
  }
}
renderHeading()

const renderTagList = () => {
  const randomColors = [
    { fg: 'rgba(249,115,22,1)', bg: 'rgba(251,146,60,0.1)' },
    { fg: 'rgba(245,158,11,1)', bg: 'rgba(251,191,36,0.1)' },
    { fg: 'rgba(234,179,8,1)', bg: 'rgba(250,204,21,0.1)' },
    { fg: 'rgba(132,204,22,1)', bg: 'rgba(163,230,53,0.1)' },
    { fg: 'rgba(34,197,94,1)', bg: 'rgba(74,222,128,0.1)' },
    { fg: 'rgba(16,185,129,1)', bg: 'rgba(52,211,153,0.1)' },
    { fg: 'rgba(20,184,166,1)', bg: 'rgba(45,212,191,0.1)' }
  ]
  const $target = $('#taglist')
  const text = ['<div blackcat>']
  $.isArray(window.tagManager && window.tagManager.tags) && window.tagManager.tags.forEach(td => {
    const $td = $(td)
    const $a = $td.children('a')
    const $span = $td.children('span')
    const colorIndex = ~~(Math.random() * randomColors.length)
    const color = randomColors[colorIndex]
    text.push(`<a href="${ $a.attr('href') }" style="--fg:${ color.fg }; --bg:${ color.bg }"><span>${ $a.text() }</span><span class="dot">·</span><span class="count">${ $span.html().replace(/\D+/g, '') }</span></a>`)
  })
  text.push('</div>')
  $target.append(text.join(''))
}
renderTagList()

const renderPagination = () => {
  const $pagination = $('.topicListFooter .pager')
  const $tagListPagination = $('#myposts .pager')

  const render = ($dom) => {
    const elDOM = $dom[0]
    if (!elDOM) return

    const domList = []
    elDOM.childNodes.forEach((node) => {
      const isTextNode = node.nodeType === Node.TEXT_NODE
      const text = node.textContent
      const isEmpty = isTextNode && text.trim() === ''
      if (isEmpty) return false
      domList.push(isTextNode ? DOM.a({ class: 'span' }, text) : node)
    })

    $dom.empty().prepend(domList)
  }

  render($pagination)
  render($tagListPagination)
}
renderPagination()

const renderPostList = () => {
  const currentYear = new Date().getFullYear()
  const render = ($container, $desc, currentDate) => {
    const data = {
      date: currentDate.length >= 3 ? toDateString(currentDate.join('/'), 'yyyy年MM月dd日') : toDateString(currentDate.join('/'), 'MM月dd日'),
      view: $desc.children('.post-view-count').html().replace(/\D+/g, ''),
      comment: $desc.children('.post-comment-count').html().replace(/\D+/g, ''),
      digg: $desc.children('.post-digg-count').html().replace(/\D+/g, ''),
      editUrl: $desc.children('a').attr('href')
    }

    $container.append(`
<div blackcat>
  <time>${ data.date }</time>
  <span class="dot">· </span>
  <span class="view" data-tippy="阅读"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path fill="currentColor" d="M30.94 15.66A16.69 16.69 0 0 0 16 5A16.69 16.69 0 0 0 1.06 15.66a1 1 0 0 0 0 .68A16.69 16.69 0 0 0 16 27a16.69 16.69 0 0 0 14.94-10.66a1 1 0 0 0 0-.68ZM16 25c-5.3 0-10.9-3.93-12.93-9C5.1 10.93 10.7 7 16 7s10.9 3.93 12.93 9C26.9 21.07 21.3 25 16 25Z"></path><path fill="currentColor" d="M16 10a6 6 0 1 0 6 6a6 6 0 0 0-6-6Zm0 10a4 4 0 1 1 4-4a4 4 0 0 1-4 4Z"></path></svg>${ data.view }</span>
  <span class="comment" data-tippy="评论"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="M8 11a1 1 0 1 0 1 1a1 1 0 0 0-1-1Zm4 0a1 1 0 1 0 1 1a1 1 0 0 0-1-1Zm4 0a1 1 0 1 0 1 1a1 1 0 0 0-1-1Zm-4-9A10 10 0 0 0 2 12a9.89 9.89 0 0 0 2.26 6.33l-2 2a1 1 0 0 0-.21 1.09A1 1 0 0 0 3 22h9a10 10 0 0 0 0-20Zm0 18H5.41l.93-.93a1 1 0 0 0 .3-.71a1 1 0 0 0-.3-.7A8 8 0 1 1 12 20Z"></path></svg>${ data.comment }</span>
  <span class="digg" data-tippy="推荐"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--carbon" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path fill="currentColor" d="M22.45 6a5.47 5.47 0 0 1 3.91 1.64a5.7 5.7 0 0 1 0 8L16 26.13L5.64 15.64a5.7 5.7 0 0 1 0-8a5.48 5.48 0 0 1 7.82 0l2.54 2.6l2.53-2.58A5.44 5.44 0 0 1 22.45 6m0-2a7.47 7.47 0 0 0-5.34 2.24L16 7.36l-1.11-1.12a7.49 7.49 0 0 0-10.68 0a7.72 7.72 0 0 0 0 10.82L16 29l11.79-11.94a7.72 7.72 0 0 0 0-10.82A7.49 7.49 0 0 0 22.45 4Z"></path></svg>${ data.digg }</span>
</div>
`.trim())
  }

  $('.day > .postTitle[role="heading"]').map(function() {
    const $self = $(this)
    const $container = $self.children('a')
    const $desc = $self.siblings('.postDesc')
    const currentDate = $desc.html().slice(9, 19).split('-').map(d => +d)
    currentDate[0] === currentYear && currentDate.shift()

    const $mark = $container.find('.pinned-post-mark')
    $mark.parent().append($mark)
    $mark.html('TOP')

    render($container, $desc, currentDate)
  })

  $('#myposts .postTitl2[role="heading"]').map(function() {
    const $self = $(this)
    const $container = $self.children('a')
    const $desc = $self.siblings('.postDesc2')
    const currentDate = $desc[0].firstChild.textContent.trim().slice(-16, -6).split('-').map(d => +d)
    currentDate[0] === currentYear && currentDate.shift()

    render($container, $desc, currentDate)
  })
}
renderPostList()

const renderPost = () => {
  if (!window.cb_entryCreatedDate || !window.cb_entryId || !$('#cnblogs_post_body').length) return

  const currentYear = new Date().getFullYear()
  const currentDate = window.cb_entryCreatedDate.slice(0, 10).split('-').map(d => +d)
  currentDate[0] === currentYear && currentDate.shift()
  const date = currentDate.length >= 3 ? toDateString(currentDate.join('/'), 'yyyy年MM月dd日') : toDateString(currentDate.join('/'), 'MM月dd日')
  const readTime = ~~($('#cnblogs_post_body').html().trim().length / 450)
  $('#topics .postTitle').after(`
<div blackcat>
  <time>${ date }</time>
  <span class="dot">· </span>
  <span>${ readTime || 1 } 分钟</span>
</div>
`.trim())
}
renderPost()

const renderAvatar = () => {
  const $feedbackList = $('#blog-comments-placeholder .feedbackItem')
  $feedbackList.map(function() {
    const $self = $(this)
    const avatar = $.trim($self.find('.feedbackCon span:last-child').html()) || (() => {
      const random = [
        'alien',
        'angry-face',
        'angry-face-with-horns',
        'anguished-face',
        'anxious-face-with-sweat',
        'astonished-face',
        'beaming-face-with-smiling-eyes',
        'bug',
        'bullseye'
      ]
      return `https://api.iconify.design/fluent-emoji:${ random[~~(Math.random() * random.length)] }.svg`
    })()
    const link = $self.find('.feedbackListSubtitle [id^="a_comment_author"]').attr('href')
    $self.prepend(`<a${ avatar.includes('api.iconify.design') ? '' : ` href="${ link }"` }><img class="blackcat-avatar" src="${ avatar }"></a$>`)
  })
}

$(document).ajaxComplete(function(_event, _xhr, options) {
  ~options.url.indexOf('GetComments') && renderAvatar()
})

$('body').removeClass('loading')
</script>

<script src="https://unpkg.com/@popperjs/core@2/dist/umd/popper.min.js"></script>
<script src="https://unpkg.com/tippy.js@6/dist/tippy.umd.min.js"></script>
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>

<script>
new window.VConsole()

tippy(document.querySelectorAll('#navList > li > a'), {
  theme: 'tooltip',
  animation: 'shift-away-subtle',
  arrow: false,
  // delay: [100, 100000],
  content: reference => reference.innerHTML.trim(),
})

tippy('[data-tippy]', {
  theme: 'tooltip',
  animation: 'shift-away-subtle',
  arrow: false,
  placement: 'bottom',
  offset: [0, 4],
  content: reference => reference.dataset.tippy,
})
</script>

<!-- end: BlackCat PageFooter -->
